<template>
  <div class="tx-button-text-delete"  v-if="$showAuthElement()">
    <el-button :type="type" @click="handleDelete()">{{name}}</el-button>
    <el-dialog :title="'删除'+target" :visible.sync="visible" width="500px" :before-close="handleClose" center append-to-body >
      <div class="tx-button-text-delete__content" v-loading="loading">
        <slot>
          确定要删除{{target}}吗？<br>
          删除的数据将无法找回，请谨慎操作。
        </slot>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="handleConfirm()" :disabled="loading">删除</el-button>
        <el-button @click="handleClose()" :disabled="loading">暂不删除</el-button>
      </div>
    </el-dialog>
  </div>

</template>

<script>
export default {
  props: {
    entity: {
      type: Object,
      default: () => {
        return {};
      }
    },
    controller: {
      type: String,
      default: ""
    },
    method: {
      type: String,
      default: "delete"
    },
    idKey: {
      type: String,
      default: null
    },
    body: {
      type: [Object,String],
      default: ()=>{
        return ""
      }
    },
    idValue: {
      type: String,
      default: ""
    },
    type: {
      type: String,
      default: "text"
    },
    name: {
      type: String,
      default: "删除"
    },
    success: {
      type: Function,
    },
    error: {
      type: Function,
    },

    target: {
      type: String,
      default: "数据"
    },


  },
  data() {
    return {
      loading: false,
      visible: false,
    };
  },
  methods: {
    handleDelete() {
      this.visible = true;
    },
    handleConfirm() {
      if(this.body && !this.body.id && !this.body.orgId) {
        this.success && this.success();
        this.visible = false;
        return false
      }
      this.loading = true;
      let method = this.$api[this.controller][this.method]
      let param = { body: {} }
      param.body[this.idKey] = this.idValue;
      if(this.idKey){
        param={ body: {} }
        param.body[this.idKey] = this.idValue;
      }else{
        param={ body: this.body }
      }
      param.body.createdBy=this.$userInfo.phone
      method.call(null, param, res => {
        this.loading = false;
        this.visible = false;
        this.$message({
          type: 'success',
          message: '删除成功!'
        });
        this.success && this.success();
      }, this.error).catch(err => {
        this.loading = false;
      })
    },
    handleClose() {
      this.$message({
        type: 'info',
        message: '已取消删除'
      });
      this.visible = false;
    }
  },
};
</script>
<style lang="scss">
.tx-button-text-delete {
  display: inline-block;
 
  margin-left: 10px;
  height: 32px;
  border-radius: 4px;
  border: 1px solid #FF6A6B !important;
  background: transparent !important;
  .el-button--text{
    color: #FF6A6B !important;

  }

  &__content {
    color: #FFF;
    text-align: center;
  }
}
</style>
 
